
// 锚点动画 根 返回顶部功能



var returnTop = document.getElementById("returnTop");
var returnTop = document.getElementById("returnTop");
var lis = document.getElementById("point");

window.onscroll = function () {
    // 获取当前滚动条高度，并且做个兼容处理
    var height = document.documentElement.scrollTop || document.body.scrollTop;
    if (height > 400) {
        returnTop.style.display = "block";
    } else {
        returnTop.style.display = "none";
    }
    if(height > 700){
        lis.style.display = "block";
    } else {
        lis.style.display = "none";
    }
}
returnTop.onclick = function () {
    // 由于设置了返回顶部按钮需要滚动条距离顶部有400像素才会显示，所以这里判断当前滚动条距离顶部距离不可能是0，进行true 处理
    if (document.documentElement.scrollTop) {
        var time = setInterval(function () {
            document.documentElement.scrollTop -= 200;

            if (document.documentElement.scrollTop <= 0) {
                clearInterval(time)
            }
        }, 10)
    }
}

$(function () {
    $("#myid").click(function () {

        // location是 Window 对象的一个部分，包含有关当前 URL 的信息
        // location.pathname 属性是一个可读可写的字符串，可设置或返回当前 URL 的路径部分
        // location.hostname 属性是一个可读可写的字符串，可设置或返回当前 URL 的主机名。
        if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
            // this 指向的是 id值为 #myid 的标签
            // hash 属性是一个可读可写的字符串，该字符串是 URL 的锚部分（从 # 号开始的部分）
            // 把 取出结果转变为jQuery 对象

            var $target = $(this.hash);
            
            // 目标 : 确保 $target 根据hash选中正确的元素; 
            // 是否通过hash值成功选中元素 ; 
            if($target.length > 0 ){
                // #jiaju 
                // $('[name=jiaju]')
                $target = $target || $('[name=' + this.hash.slice(1) + ']');
            }   
            if ($target.length) {
                // 定义变量获取 当前标签元素id为(star)距离页面顶部距离
                var targetOffset = $target.offset().top;
                // 自定义动画，设置给 html  和 body  是当触发点击时，不论页面在什么位置，都需要将移动到指定高度
                // scrollTop() 返回或设置匹配元素的滚动条的垂直位置。
                $('html,body').animate({ scrollTop: targetOffset }, 30);
                return false;
            }
        }
    });
});
